import { useEffect } from 'react';
import { useUser } from '@/contexts/UserContext';
import { useNavigate } from 'react-router-dom';

interface ProtectedRouteProps {
  children: React.ReactNode;
}

const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
  const { token, isLoading } = useUser();
  const navigate = useNavigate();

  useEffect(() => {
    // 如果不是在加载状态且没有token，则重定向到登录页
    if (!isLoading && !token) {
      navigate('/login');
    }
  }, [token, isLoading, navigate]);

  // 如果仍在加载或有token，则渲染子组件
  // 否则不渲染任何内容（等待重定向）
  return !isLoading && token ? <>{children}</> : null;
};

export default ProtectedRoute;